@import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('../dist/bootstrap/css/bootstrap.min.css');
:root {--primary-font: 'Public Sans', sans-serif, Arial, Helvetica; --secondary-font: 'Plexes', sans-serif; --thrid-font: 'Raleway', sans-serif; --dark-green: #234131; --dark-green-1: #061D16; --green: #0B5841; --yellow: #FEC426; --gray: #707070; }
@font-face { font-family: 'Plexes'; src: url('../fonts/PlexesBlackItalic.woff2') format('woff2'), url('../fonts/PlexesBlackItalic.woff') format('woff'); font-weight: 900; font-style: italic; font-display: swap; }
body { color: var(--bs-black); font-family: var(--primary-font); font-weight: 400; overflow-x: hidden; position: relative; }
a { color: var(--blue); }
a, a:hover { text-decoration: none; }
a:focus { outline: none; }
*:focus { outline: none; }
button:active, button:focus, .btn:active, .btn:focus { box-shadow: none !important; outline: none !important; }
.img-responsive, .navbar-brand > img { display: inline-block; }
img { display: inline-block; height: auto; max-width: 100%; }
h1, h2, h3, h4, h5, h6 { color: var(--green); font-family: var(--secondary-font); font-weight: 800; }
h1 { font-size: 86px; }
h2 { font-size: 57px; line-height: 58px; margin-bottom: 5%; }
h3 { font-size: 41px; }
h4 { font-size: 24px; }
p, li { color: var(--bs-black); font: 400 16px/1.5 var(--primary-font); overflow-wrap: break-word; word-wrap: break-word; }
.clearfix { clear: both; margin: 0px; padding: 0px; }

.info { color: var(--dark-green); font: 800 16px var(--thrid-font); padding: 12px 1.5rem; text-align: center; text-transform: uppercase; }

header { background-color: var(--dark-green); border-top: 10px solid var(--yellow); clear: both; height: 80px; margin-bottom: 60px; padding-top: 5px; width: 100%; }
header img { max-width: 185px; }

.radical { background: url("../images/radical.png") no-repeat top center / 100% 100%; box-shadow: 0px 0px 9px rgba(0, 0, 0, 29%); clear: both; height: 15px; width: 100%; }
.intro { background-color: var(--bs-black); border-bottom: 7px solid var(--yellow); border-top: 7px solid var(--yellow); clear: both; padding-bottom: 50px; width: 100%; }
.intro h1 { color: var(--yellow); margin-top: -110px; text-align: center; text-transform: uppercase; }
.intro p { color: var(--bs-white); font-size: 16px; }
.intro hr { border-top: 2px solid var(--bs-white); margin-bottom: 35px; opacity: 1; }
.intro .kc { clear: both; margin-bottom: -100px; text-align: center; width: 100% }
.intro .kc img { max-width: 115px; }
.intro .content { padding: 0px 5%; }

.main { background: url("../images/mn_tex_01.jpg") no-repeat left top / 100%, url("../images/mn_tex_02.jpg") no-repeat left bottom / 100%; clear: both; margin-bottom: 8%; padding: 6% 5% 6% 3.5%; width: 100%; }
.main .row { margin-bottom: 5%; }
.main h4 { color: var(--bs-black); margin-bottom: 18px; }
.main p { font-weight: 500; }

.mvtop { margin: -50px 0px 0px -20px; }
.improve { background-color: var(--dark-green-1); border-radius: 50px; box-shadow: 0px 0px 15px rgba(0, 0, 0, 50%); clear: both; margin: 5% 0px 12%; padding: 4% 10% 4% 30%; width: 100%; }
.improve h3, .improve p { color: var(--bs-white); }
.improve p { font-size: 14px; }

.strength p { font-size: 18px; font-style: italic; font-weight: 400; }
.head { clear: both; margin-top: 20px; width: 100%; }

.object { background: rgba(11,88,65,1); background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(11,88,65,1) 100%); border: 2px solid var(--gray); border-radius: 25px; box-shadow: 0px 3px 6px rgba(0, 0, 0, 16%); clear: both; padding: 20% 7% 5%; position: relative; width: 100%; }
.object h3 { background: url("../images/hed_bg.png") no-repeat left top / 100% 100%; color: var(--bs-black); font-size: 48px; height: 68px; left: 0; margin-left: -5%; position: absolute; text-align: center; text-transform: uppercase; top: 25px; width: 110%; z-index: 1; }
.object ul { list-style: none; margin: 0px; padding: 0px; }
.object ul li { background: url("../images/dot.png") no-repeat left 15px / 12px; color: var(--bs-white); font-size: 22px; margin-bottom: 15px; padding-left: 7%; }

.resources { clear: both; text-align: center; width: 100%; }
.resources h1 { font-size: 72px; }
.resources p { font-size: 17px; font-weight: 900; }

/*-------------------
    Media Query
---------------------------*/

@media only screen and (max-width: 767px) {
	h1 { font-size: 30px; }
	h2 { font-size: 38px; line-height: 48px; }
	h3 { font-size: 26px; }
	h4 { font-size: 22px; }
	p, li { font-size: 14px; }
	.col { flex-basis: auto; }
	.info { font-size: 12px; }
	.intro h1 { margin-top: -40px; }
	.intro hr { margin-bottom: 15px; }
	.intro p, .strength p { font-size: 14px }
	.improve { border-radius: 20px; margin-top: -47%; padding: 45% 20px 10px; }
	.mvtop { margin: 30px 0px 0px 0px; position: relative !important; }
	.object { padding-top: 90px; margin-bottom: 15px; }
	.object h3 { font-size: 38px; height: 52px; }
	.object ul li { background-size: 7px; background-position: left 8px; font-size: 14px; }
	.resources h1 { font-size: 38px; }
	.resources p { font-size: 16; }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {    
	h1 { font-size: 64px; }
	h2 { font-size: 42px; line-height: 52px; }
	h3 { font-size: 26px; }
	h4 { font-size: 22px; }
	p { font-size: 15px; }
	.intro h1 { margin-top: -80px; }
	.mvtop { margin: 50px 0px 0px -20px; }
	.object { padding-top: 90px; margin-bottom: 15px; }
	.object h3 { font-size: 38px; height: 52px; }
	.object ul li { background-size: 7px; background-position: left 8px; font-size: 16px; }
	.resources h1 { font-size: 52px; }
	.resources p { font-size: 14px; }
}

@media only screen and (min-width: 992px) and (max-width: 1180px) {
	.mvtop { margin: 50px 0px 0px -20px; }
	.object { padding-top: 90px; margin-bottom: 15px; }
	.object h3 { font-size: 42px; height: 58px; }
	.object ul li { background-size: 10px; background-position: left 8px; font-size: 18px; }
	.resources p { font-size: 15px; }
}

@media (min-width: 1560px) {
	h1 { font-size: 103px; }
	h2 { font-size: 73px; line-height: 68px; }
	h3 { font-size: 41px; }
	h4 { font-size: 30px; }
	p { font-size: 16px; }
	.container { max-width: 1430px; }
	.info { font-size: 20px; }
	header { border-top: 14px solid var(--yellow); height: 118px; margin-bottom: 60px; }
	header img, .intro .kc img { max-width: inherit; }
    .radical { height: 23px; }
    .intro { border-bottom: 11px solid var(--yellow); border-top: 11px solid var(--yellow); }
    .intro h1 { margin-top: -140px; }
    .intro p { color: var(--bs-white); font-size: 21px; }
    .intro .kc { clear: both; margin-bottom: -110px; }
    .improve { padding: 6% 10% 6% 40%; }
    .improve p { font-size: 17px; }
    .mvtop { margin: -70px 0px 0px -30px; }
    .strength p { font-size: 22px; }
    .object { border-radius: 20px; }
    .object h3 { font-size: 60px; height: 78px; }
    .object ul li { background-size: inherit; font-size: 29px; }
    .resources h1 { font-size: 86px; }
    .resources p { font-size: 23px; }
}